<template>
	<view class="page">
		<!-- #ifndef MP-WEIXIN-->
		<my-navbar leftText="立即支付" @leftClick="leftClick"></my-navbar>
		<!-- #endif -->

		<view class="content">
			<view v-if="id">
				<view class="row">
					<text>订单编号</text>
					<text>{{info.order_sn}}</text>
				</view>
				<view class="row">
					<text>配送时间</text>
					<text>{{info.send_time}}</text>
				</view>
				<view class="row">
					<text>商品总金额</text>
					<text>￥{{info.order_money}}</text>
				</view>
				<view class="row">
					<text>满减</text>
					<text>￥{{Number(info.full_reduction_money).toFixed(2)}}</text>
				</view>
				<view class="row">
					<text>优惠券</text>
					<text>￥{{info.discount_money}}</text>
				</view>
				
				<view class="row">
					<text>运费</text>
					<text>￥{{Number(info.delivery_fee).toFixed(2)}}</text>
				</view>
				
				<view class="row">
					<text>下单金额</text>
					<text>￥{{Number(info.should_money).toFixed(2)}}</text>
				</view>
				
				<view class="row">
					<text>差额</text>
					<text>￥{{info.balance}}</text>
				</view>
				<view class="row">
					<text>实付金额</text>
					<text>￥{{info.real_money}}</text>
				</view>
			</view>
			<view class="pay">
				<view class="tit">支付方式</view>
				<radio-group @change="selectPay">
					<label class="pay_list">
						<view class="flex-middle">
							<image src="../../static/image/pay1.png" mode="aspectFit"></image>
							微信支付
						</view>
						<radio value="wx" :checked="true" color="#4FA388"/>
					</label>
					<!-- <label class="pay_list">
						<view class="flex-middle">
							<img src="../../static/image/pay4.png" mode="aspectFit">
							支付宝支付
						</view>
						<radio value="zfb" :checked="false" color="#4FA388"/>
					</label>
					<label class="pay_list">
						<view class="flex-middle">
							<img src="../../static/image/pay2.png" mode="aspectFit">
							银联支付
						</view>
						<radio value="qmf" :checked="false" color="#4FA388"/>
					</label>
					<label class="pay_list">
						<view class="flex-middle">
							<img src="../../static/image/pay3.png" mode="aspectFit">
							云闪付
						</view>
						<radio value="uac" :checked="false" color="#4FA388"/>
					</label> -->
				</radio-group>
			</view>
			<view class="tips">注：平台不会以订单异常，系统升级等理由要求您点击任何链接进行退款操作，请提高警惕谨防受骗！</view>
		</view>

		<view class="submit flex flex_col_center">
			<view class="sixteen ">
				<text class="bold">合计</text>：
				<text class="red_font">￥{{info.real_money||balance}}</text>
			</view>
			<view class="order twelve_font" @click="submit">
				确认支付
			</view>
		</view>
	</view>
</template>

<script>
	import {$https} from '@/static/js/request.js';
	export default {
		data() {
			return {
				info:{},
				checked:'wx',	//默认选中
				id:null,	//订单id
				balance:null,	//金额 从结清订单流水进来
				wx_pay:uni.getStorageSync('wx_pay'),	//0:使用银联的微信支付   1:使用微信自身支付
			};
		},
		onReady(){
			getApp().setTitle()
		},
		onLoad(option){
			this.id = option.id;
			this.balance = Math.abs(option.balance).toFixed(2);
			//从购物车那里进来
			if(this.id){
				this.getData(option.id)
			}
		},
		methods:{
			getData(id){
				$https('GET','getOrderDetail',{oid:id},res=>{
					if(res.data.errcode==0){
						this.info = res.data.data.order_info;
					}else{
						uni.showToast({
							title: res.data.errmsg,
							icon:'none'
						});
					}
				})
			},
			selectPay(e){
				this.checked = e.detail.value
			},
			submit(){
				if(this.id!=null){
					//支付0元订单
					if(Number(this.info.real_money)==0){
						$https('POST','payZeroOrder',{id:this.id},res=>{
							if(res.data.errcode==0){
								var ms = Number(res.data.data.pay_time+'000');
								var now = new Date();
								now.setTime(ms);
								var time = now.getFullYear()+"-" + (now.getMonth()+1) + "-" + now.getDate()+ ' ' + now.getHours()+':'+now.getMinutes()+':'+now.getSeconds()
								uni.navigateTo({
									url:`/pages/shopcart/pay_status?status=TRADE_SUCCESS&merOrderId=${res.data.data.order_sn}&payTime=${time}&totalAmount=0`
								})
							}else{
								uni.showToast({
									title: res.data.errmsg,
									icon:'none'
								});
							}
						})
					}else{
						let payType = this.checked;
//#ifdef MP-WEIXIN
						if(payType=='wx'){payType = 'xcx_wx'}
//#endif				
						let params = {},url;
						if(this.wx_pay && (payType==='wx'||payType==='xcx_wx')){
							//使用微信自带支付
							url = 'wxPay/createOrder';
							//order_type:1商品订单，2差额订单
							let type;	//1公众号，2小程序，3app
// #ifdef H5
							type = 1;
// #endif
// #ifdef MP-WEIXIN
							type = 2;
// #endif
// #ifdef APP-PLUS
							type = 3;
// #endif
							Object.assign(params,{pay_type:type,order_type:1,oid:this.id}) 
						}else{
							url = 'getUnionUrl';
							//使用银联合作的支付
							Object.assign(params,{pay_type:payType,oid:this.id})
						}
						$https('GET',url,params,res=>{
							if(res.data.errcode==0){
//#ifdef H5
								if(this.wx_pay && (payType==='wx'||payType==='xcx_wx')){
									//h5 微信支付
									WeixinJSBridge.invoke('getBrandWCPayRequest', {
										"appId": res.data.data.appId,     //公众号ID，由商户传入     
										"timeStamp": res.data.data.timeStamp,     //时间戳，自1970年以来的秒数     
										"nonceStr": res.data.data.nonceStr,      //随机串     
										"package": res.data.data.package,
										"signType":res.data.data.signType,     //微信签名方式：     
										"paySign": res.data.data.paySign //微信签名 
									},function(res) {
										if (res.err_msg == "get_brand_wcpay_request:ok") {
											uni.showToast({
												icon:'success',
												title:'支付成功',
												success(){
													setTimeout(()=>{
														uni.switchTab({
															url:'/pages/tabar/order'
														})										
													},1500)
												}
											})
										}else{
											uni.showToast({
												icon:'none',
												title:res.errMsg
											})
										}
									});
									
								}else{
									//h5 银联支付跳转
									window.location.href =res.data.data.url
								}
//#endif
//#ifdef MP-WEIXIN
								wx.requestPayment({
									  timeStamp: res.data.data.timeStamp,
									  nonceStr: res.data.data.nonceStr,
									  package: res.data.data.package,
									  signType: res.data.data.signType,
									  paySign: res.data.data.paySign,
									  success (res) {
										if(res.errMsg==='requestPayment:ok'){
											uni.showToast({
												icon:'success',
												title:'支付成功',
												success(){
													setTimeout(()=>{
														uni.switchTab({
															url:'/pages/tabar/order'
														})										
													},1500)
												}
											})
										}
									  },
									  fail (res) {
										  // console.log('失败',res)
										  if(res.errMsg==='requestPayment:fail cancel'){
											 uni.showToast({
												icon:'none',
												title:'用户取消支付'
											 })
										  }else{
											  uni.showToast({
												icon:'none',
												title:'支付失败'
											  })
										  }
									  }
								})
//#endif
// #ifdef APP-PLUS
								uni.requestPayment({
								    "provider": "wxpay", 
								    "orderInfo": {
								        "appid": res.data.data.appid,  // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
								        "noncestr": res.data.data.noncestr, // 随机字符串
								        "package": res.data.data.package,        // 固定值
								        "partnerid": res.data.data.partnerid,      // 微信支付商户号
								        "prepayid": res.data.data.prepayid, // 统一下单订单号 
								        "timestamp": res.data.data.timestamp,        // 时间戳（单位：秒）
								        "sign": res.data.data.sign // 签名，这里用的 MD5 签名
								    },
								    success(res) {
										uni.showToast({
											icon:'success',
											title:'支付成功！',
											success:()=>{
												setTimeout(()=>{
													uni.switchTab({
														url:'/pages/tabar/order'
													})										
												},1500)
											}
										})
									},
								    fail(e) {
										if(e.errCode==-2){
											uni.showToast({
												icon:'none',
												title:'用户取消支付！'
											})
										}else{
											uni.showToast({
												icon:'none',
												title:'支付失败！'
											})
										}
									}
								})
// #endif
							}else{
								uni.showToast({
									title: res.data.errmsg,
									icon:'none'
								});
							}
						})
					}
				}else{
					//结差额
					$https('POSTN','addBalanceOrder',{},res=>{
						if(res.data.errcode==0){
							let payType = this.checked;
//#ifdef MP-WEIXIN
							if(payType=='wx'){payType = 'xcx_wx'}
//#endif
						let params = {},url;
						if(this.wx_pay && (payType==='wx'||payType==='xcx_wx')){
							//使用微信自带支付
							url = 'wxPay/createOrder';
							//order_type:1商品订单，2差额订单
							let type;	//1公众号，2小程序，3app
// #ifdef H5
							type = 1;
// #endif
// #ifdef MP-WEIXIN
							type = 2;
// #endif
// #ifdef APP-PLUS
							type = 3;
// #endif
							Object.assign(params,{pay_type:type,order_type:2,oid:res.data.data.id}) 
						}else{
							url = 'getUnionUrlBalance';
							//使用银联合作的支付
							Object.assign(params,{oid:res.data.data.id,pay_type:payType})
						}
						$https('GET',url,params,res=>{
							if(res.data.errcode==0){
//#ifdef H5
									if(this.wx_pay && (payType==='wx'||payType==='xcx_wx')){
										//h5 微信支付
										WeixinJSBridge.invoke('getBrandWCPayRequest', {
											"appId": res.data.data.appId,     //公众号ID，由商户传入     
											"timeStamp": res.data.data.timeStamp,     //时间戳，自1970年以来的秒数     
											"nonceStr": res.data.data.nonceStr,      //随机串     
											"package": res.data.data.package,
											"signType":res.data.data.signType,     //微信签名方式：     
											"paySign": res.data.data.paySign //微信签名 
										},function(res) {
											if (res.err_msg == "get_brand_wcpay_request:ok") {
												uni.showToast({
													icon:'success',
													title:'支付成功',
													success(){
														setTimeout(()=>{
															uni.switchTab({
																url:'/pages/tabar/user'
															})										
														},1500)
													}
												})
											}else{
												uni.showToast({
													icon:'none',
													title:res.errMsg
												})
											}
										});
										
									}else{
										//h5 银联支付跳转
										window.location.href =res.data.data.url
									}
//#endif
//#ifdef MP-WEIXIN

								wx.requestPayment({
									  timeStamp: res.data.data.timeStamp,
									  nonceStr: res.data.data.nonceStr,
									  package: res.data.data.package,
									  signType: res.data.data.signType,
									  paySign: res.data.data.paySign,
									  success (res) {
										if(res.errMsg==='requestPayment:ok'){
											uni.showToast({
												icon:'success',
												title:'支付成功',
												success(){
													setTimeout(()=>{
														uni.switchTab({
															url:'/pages/tabar/order'
														})										
													},1500)
												}
											})
										}
									  },
									  fail (res) {
										  // console4.log(res)
										  if(res.errMsg==='requestPayment:fail cancel'){
											 uni.showToast({
												icon:'none',
												title:'用户取消支付'
											 })
										  }else{
											  uni.showToast({
												icon:'none',
												title:'支付失败'
											  })
										  }
									  }
								})
//#endif
// #ifdef APP-PLUS
								uni.requestPayment({
								    "provider": "wxpay", 
								    "orderInfo": {
								        "appid": res.data.data.appid,  // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
								        "noncestr": res.data.data.noncestr, // 随机字符串
								        "package": res.data.data.package,        // 固定值
								        "partnerid": res.data.data.partnerid,      // 微信支付商户号
								        "prepayid": res.data.data.prepayid, // 统一下单订单号 
								        "timestamp": res.data.data.timestamp,        // 时间戳（单位：秒）
								        "sign": res.data.data.sign // 签名，这里用的 MD5 签名
								    },
								    success(res) {
								    	uni.showToast({
								    		icon:'success',
								    		title:'支付成功！',
								    		success:()=>{
								    			setTimeout(()=>{
								    				uni.switchTab({
								    					url:'/pages/tabar/user'
								    				})										
								    			},1500)
								    		}
								    	})
								    },
								    fail(e) {
								    	if(e.errCode==-2){
								    		uni.showToast({
								    			icon:'none',
								    			title:'用户取消支付！'
								    		})
								    	}else{
								    		uni.showToast({
								    			icon:'none',
								    			title:'支付失败！'
								    		})
								    	}
								    }
								})
// #endif
								}
							})
						}else{
							uni.showToast({
								title: res.data.errmsg,
								icon: 'none'
							});
						}
					})
				}
			},
			
			leftClick(){
				// #ifdef H5
					window.history.back(-1);
				// #endif 
				// #ifndef H5
				uni.navigateBack();
				// #endif
			}
		}
	}
</script>

<style lang="scss" scoped>
.page{
	.content{
		padding: 0 40rpx;
		padding-bottom:200rpx;
		.row{
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin:40rpx 0;
			font-size: 32rpx;
			font-weight: 500;
			text:first-child{
				color:#191919;
			}
			text:last-child{
				color:#9A9A9A;
			}
		}
		.pay{
			font-size: 32rpx;
			color:#191919;
			.tit{
				margin-bottom:54rpx;
			}
			.pay_list{
				font-size: 24rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom:56rpx;
				img,image{
					margin-right:26rpx;
					
					width:40rpx;
					height: 40rpx;
				/* #ifdef MP-WEIXIN*/ 
				/* #endif */
				}
				radio{
					transform: scale(0.6);
				}
			}
		}
		.tips{
			font-size: 24rpx;
			color:#ccc;
		}
	}
	.submit {
		height: 134rpx;
		position: fixed;
		left:0;
		right:0;
		bottom: 0;
		background: $white;
		justify-content: flex-end;
		box-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
		padding: 0 44rpx;
		.order {
			background: $dgreen;
			color: $white;
			padding: 20rpx 46rpx;
			border-radius: 40rpx;
			margin-left: 42rpx;
		}
	}
}
</style>
